import React, { Component } from 'react'
import { List } from 'antd-mobile';
import '../../assets/css/detail/k-commont.less'
const Item = List.Item;
const Brief = Item.Brief;


export default class KCommont extends Component {
    state = {
        data: [
            {
                id: 1,
                avatar: require('../../assets/images/avatar.jpg').default,
                username: '用户名1',
                commont: '评论内容',
                like: 75
            },
            {
                id: 2,
                avatar: require('../../assets/images/avatar.jpg').default,
                username: '用户名2',
                commont: '评论内容',
                like: 15
            },
            {
                id: 3,
                avatar: require('../../assets/images/avatar.jpg').default,
                username: '用户名3',
                commont: '评论内容',
                like: 1003
            }
        ]
    }
    render() {
        return (
            <div className="k-commont">
                <h4>评论</h4>
                <List>
                    {
                        this.state.data.map(e => {
                            return <Item
                                key={e.id}
                                extra={<div>{e.like}<i className="iconfont icon-zan"></i></div>}
                                thumb={e.avatar}
                                multipleLine
                            >
                                {e.username} <Brief>{e.commont}</Brief>
                            </Item>
                        })
                    }
                </List>
            </div>
        )
    }
}
